<template>
  <div style="margin: 30px">

    <el-row>
      <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
        <div style="width: 90%;padding-left:25px;padding-bottom:10px;padding-top: 10px;background-color: #00afff">
          基本信息(带<span style="color: red">*</span>号为必填项)
        </div>
        <div style="width: 90%;padding: 20px;height: 100%">
          <el-col :span="12">
            <el-row>
              <el-col :span="24">
                <el-form-item label="学员编号" prop="studentNumber">
                  <el-input v-model="formData.studentNumber" placeholder="请输入学员编号" clearable
                            :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="手机号码" prop="studentPhone">
                  <el-input v-model="formData.studentPhone" placeholder="请输入手机号码" clearable
                            :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="学员来源" prop="sourceId">
                  <el-select v-model="formData.sourceId" placeholder="请输入学员来源" clearable :style="{width: '100%'}">
                    <el-option v-for="(item, index) in sourceIdOptions" :key="index" :label="item.sourceName"
                               :value="item.sourceId" :disabled="item.disabled"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="所属校区" prop="schoolId">
                  <el-select v-model="schoolId" placeholder="请输入所属校区" clearable
                             :style="{width: '100%'}">
                    <el-option v-for="(item, index) in schoolIdOptions" :key="index" :label="item.schoolName"
                               :value="item.schoolId"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="家庭住址" prop="studentAddress">
                  <el-input v-model="formData.studentAddress" placeholder="请输入家庭住址" clearable
                            :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="紧急联系人" prop="contactsIdName">
                  <el-input v-model="formData.contactName" placeholder="请输入紧急联系人" clearable
                            :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="联系人关系" prop="contactsRela">
                  <el-input v-model="formData.contactRelation" placeholder="请输入联系人关系" clearable
                            :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="联系手机" prop="contactsIdPhone">
                  <el-input v-model="formData.contactPhone" placeholder="请输入联系手机" clearable
                            :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-col>
          <el-col :span="12">
            <el-row>
              <el-col :span="24">
                <el-form-item label="学生姓名" prop="studentName">
                  <el-input v-model="formData.studentName" placeholder="请输入学生姓名" clearable
                            :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="身份证号" prop="studentIdNumber">
                  <el-input v-model="formData.studentIdNumber" placeholder="请输入身份证号" clearable
                            :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="课程顾问" prop="userId">
                  <el-select v-model="formData.userId" placeholder="请输入课程顾问" clearable :style="{width: '100%'}">
                    <el-option v-if="userIdOptions.length < 1" label="请先选择校区"></el-option>
                    <el-option v-else v-for="(item, index) in userIdOptions" :key="index"
                               :label="item.nickName+'('+item.phonenumber+')'"
                               :value="item.userId" :disabled="item.disabled"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="学员状态" prop="statusId">
                  <el-select v-model="formData.statusId" placeholder="请选择学员状态" clearable
                             :style="{width: '100%'}">
                    <el-option label="正式学员" value="1"></el-option>
                    <el-option label="意向学员" value="2"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="出生日期" prop="studentBirthday">
                  <el-date-picker v-model="formData.studentBirthday" format="yyyy-MM-dd"
                                  value-format="yyyy-MM-dd" :style="{width: '100%'}" placeholder="请输入出生日期" clearable>
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="性别" prop="studentSex">
                  <el-radio-group v-model="formData.studentSex" size="medium">
                    <el-radio label="男">男</el-radio>
                    <el-radio label="女">女</el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="备注信息" prop="note">
                  <el-input v-model="formData.note" type="textarea" placeholder="请输入备注信息"
                            :autosize="{minRows: 4, maxRows: 4}" :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item size="large">
                  <el-button type="primary" @click="submitForm">提交</el-button>
                  <el-button @click="resetForm">重置</el-button>
                </el-form-item>
              </el-col>
            </el-row>
          </el-col>
        </div>
      </el-form>
    </el-row>
  </div>
</template>
<script>
import {getListSchool, getAdviser, getListSource, stuRegister} from "../../../api/student/register";
import {parseTime} from "../../../utils/ruoyi";

export default {
  components: {},
  props: [],
  data() {
    return {
      formData: {
        studentNumber: null,
        studentPhone: null,
        sourceId: null,
        schoolId: null,
        statusId: null,
        studentAddress: null,
        studentName: null,
        studentIdNumber: null,
        userId: null,
        studentBirthday: null,
        studentSex: null,
        note: null,
        contactRelation: null,
        contactName: null,
        contactPhone: null,
      },
      rules: {
        studentNumber: [{
          required: true,
          message: '请输入学员编号',
          trigger: 'blur'
        }],
        studentPhone: [{
          required: true,
          message: '请输入手机号码',
          trigger: 'blur'
        }],
        sourceId: [{
          required: true,
          message: '请输入学员来源',
          trigger: 'change'
        }],
        schoolId: [{
          required: true,
          message: '请输入所属校区',
          trigger: 'change'
        }],
        studentAddress: [{
          message: '请输入家庭住址',
          trigger: 'blur'
        }],
        studentName: [{
          required: true,
          message: '请输入学生姓名',
          trigger: 'blur'
        }],
        userId: [{
          required: true,
          message: '请输入课程顾问',
          trigger: 'change'
        }],
        statusId: [{
          required: true,
          message: '请选择学员状态',
          trigger: 'blur'
        }],
      },
      sourceIdOptions: [],
      schoolIdOptions: [],
      userIdOptions: [],
      schoolId: null

    }
  },
  computed: {},
  watch: {
    schoolId(schoolId) {
      this.formData.schoolId = null
      this.userIdOptions = []
      let id = schoolId
      if (schoolId == '') {
        id = -1
      }
      this.formData.schoolId = id
      this.getAdviser(id)
    }
  },
  created() {
    this.school()
    this.getSource()
    this.studentNumber()
  },
  mounted() {
  },
  methods: {

    studentNumber() {
      let time = parseTime(new Date(), '{y}{m}{d}{h}{i}{s}');
      this.formData.studentNumber = "ST" + time;

    },
    submitForm() {
      //studentNumber studentPhone sourceId schoolId userId statusId studentName
      if (this.formData.studentNumber == null || this.formData.studentNumber == '' ||
          this.formData.studentPhone == null || this.formData.studentPhone == '' ||
          this.formData.sourceId == null || this.formData.schoolId == null || this.formData.statusId == null ||
          this.formData.studentName == null || this.formData.studentName == '') {
          this.msgError("带*号为必填项,请填写");
      } else {
        stuRegister(this.formData).then((res) => {
          if (res.code != -1) {
            this.msgSuccess("注册成功");
            let time = parseTime(new Date(), '{y}{m}{d}{h}{i}{s}');
            this.formData.studentNumber = "ST" + time;
          } else {
            this.msgSuccess("修改失败");
          }
          this.resetForm();
        })

      }


    },
    resetForm() {
      this.$refs['elForm'].resetFields()
    },
    school() {
      getListSchool().then((res) => {
        this.schoolIdOptions = res.data
        /*console.log(this.schoolIdOptions);*/
      })
    },
    getSource() {
      this.formData.sourceId = null
      getListSource().then((res) => {
        this.sourceIdOptions = res.data
        console.log(this.sourceIdOptions);
      })
    },
    getAdviser(schoolId) {
      this.formData.userId = null
      getAdviser(schoolId).then((res) => {
        this.userIdOptions = res.data
        /*console.log(this.postIdOptions);*/
      })
    }
  }
}

</script>
<style>
</style>
